<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script>
        function handleExportXls(fileName) {
            if (!fileName || typeof fileName != "string") {
                fileName = "导出文件"
            }
            let param = {
                ...this.queryParam
            };
            // 这里我猜测是选中的数据id
            if (this.selectedRowKeys && this.selectedRowKeys.length > 0) {
                param['selections'] = this.selectedRowKeys.join(",")
            }
            console.log("导出参数", param)
            // 调用接口,接口会返回文件流也就是data
            downFile(this.url.exportXlsUrl, param).then((data) => {
                if (!data) {
                    this.$message.warning("文件下载失败")
                    return
                }
                // 这里是判断有没有别人封装的msSaveBlob方法(公司其他人实现的,不是js自带的)  ,这个方法挂载到了 window.navigator对象上    这个方法里面其实就是else里面的代码
                if (typeof window.navigator.msSaveBlob !== 'undefined') {
                    window.navigator.msSaveBlob(new Blob([data], {
                        type: 'application/vnd.ms-excel'
                    }), fileName + '.xlsx')
                } else {
                    // 这里是通过blob对象把文件流转化成可以访问的文件地址
                    let url = window.URL.createObjectURL(new Blob([data], {
                        type: 'application/vnd.ms-excel'  // 指定转化成对应的文件类型
                    }))
                    // 创建a元素  就是a标签   <a  />
                    let link = document.createElement('a')
                    // 隐藏a标签,不然会占用页面位置,导致页面滚动条或者异常
                    link.style.display = 'none'
                    //  给a元素赋值 href     <a href=url /> 
                    link.href = url
                    // 给a元素设置下载属性并赋值文件名字  , 表示点击链接之后触发下载  ,文件名就是download的值   <a  download= fileName + '.xlsx' />
                    link.setAttribute('download', fileName + '.xlsx')
                    // 往body里面添加这个a元素
                    document.body.appendChild(link)
                    // 手动触发点击事件
                    link.click()
                    document.body.removeChild(link); //下载完成移除元素
                    window.URL.revokeObjectURL(url); //释放掉blob对象
                }
            })
        }
    </script>
</head>

<body>

</body>

</html>